<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>背景属性</title>
		<style>
			bod y{
				width: 100%;
				height: 1000000px;
				background-image: url(img/蜡笔小新_爱给网_aigei_com.png);
				background-size:cover;
				/* 函数 cover 等比例放大图片 特点：原图按照比例放大存背景空间
				      【开发者：背景图大小是否等于背景空间】
				    contain 等比例缩小图片  特点：图片按照比例缩放存背景空间
					【开发者：背景图等比例显示在背景空间】
				 */
				/* 背景附件-尺寸中存在cover或者conain时 */
				/* fixed 固定   scroll 不固定*/
				background-attachment: fixed;
			}
			
			div{
				width: 600px;
				height: 600px;
				background-color: #e4393c;
				background-image: url(img/蜡笔小新_爱给网_aigei_com.png);
				/* 问题：超大图，不显示   小图，显示
				 注意：背景空间大小，如果图小于背景空间，就会出现平铺
				 */
				/* 不平铺  repeat-x y 横向、纵向平铺 */
				background-repeat: no-repeat; 
				background-size:30%;
				/* 背景尺寸属性值：数值px % |函数cover contain  ，使用需要结合其他属性才能使用*/
				/* 背景定位：前提：背景空间一定大于背景图 ，类型：关键字类型：center\left\right\top..*/
				                /*   左     上   */
				background-position: 40%   10%; 
			}
		</style>
	</head>
	<body>
	Lorem ipsum dolor sit, amet consectetur adipisicing elit. Alias dolore quam delectus fuga provident, distinctio laboriosam iure earum neque! Quis nostrum dolorem eius accusantium numquam illo quasi aliquid maiores impedit.
	Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus earum minus placeat assumenda officia rem, quas ducimus eius dolores laudantium. Provident est voluptatibus facere ipsum eius. Eveniet quidem nihil atque.
	Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto ad ratione nisi exercitationem, suscipit earum libero quaerat. Maxime, cupiditate accusamus? Quae, asperiores. Nulla blanditiis commodi voluptatum minus placeat. Aliquid, quis.
		<!-- html img 
        background是一个复合属性
		它的子属性有： background-color 背景颜色
		              background-image 背景图
			          background-size
			          background-attachment
			          background-position
			background: #f00 url('image.png') no-repeat center;
					  -->
		<div></div>
	</body>
</html>